'use strict';

define(function(require,exports,module){
	var React = require('react');
	var $ = require('jquery');
	var XDate = require('xdate');
	
	var publicObj = require('lib/public');
    var token = publicObj.get_token();
	
	/*下拉框*/
	var SelectOption = require('components/partial/SelectOption');
	
	/*DATE下拉框*/
	var SelectOptionDate = require('components/partial/SelectOptionDate');
	
	/*调用DevicePieDiagram组件*/
	var DevicePieDiagram = require('components/diagram/DevicePieDiagram');
    var DevicePieSingleDiagram = require('components/diagram/DevicePieDiagram');
    var OpenDevice = require('components/diagram/PieDiagram/OpenDevice');
    /*Loading*/
    var ReactLoading = require('../partial/ReactLoading');
	
	module.exports = React.createClass({displayName: "exports",
		handleDateChange:function(event){
			var date = event.target.value;
			this.setState({'date':date});
			this.loadDiagramData(date,this.state.hardware);
		},
		handleHardwareChange:function(event){
			var value = event.target.value;
			this.setState({'hardware':value});
			this.loadDiagramData(this.state.date,value);
		},
		loadDiagramData:function(date,hardware){
			var token = publicObj.get_token();

			if(date){
                var url = this.props.url;
                var sql_arr = [],tmp = [];

                var ios_sql = "SELECT count(DISTINCT device_key) as v\
                            	FROM qeeniao.app_info\
                            	where platform = 'iOS'\
								and thedate = "+date;

                var android_sql = "SELECT count(DISTINCT device_key) as v\
                                FROM qeeniao.app_info\
                                where platform = 'Android'\
                                and  thedate = "+date;

                sql_arr.push({'name':'android','sql':android_sql});
                sql_arr.push({'name':'ios','sql':ios_sql});

                sql_arr.forEach(function(v,k){
                    $.ajax({
                        url:url,
                        data:{sql:v.sql,'access_token':token},
                        type:'post',
                        dataType:'json',
                        success:function(o){
                            tmp = this.state.data;
                            tmp[v.name] = o[0].v;
                            if(this.isMounted()) {
                                this.setState({'data': tmp});
                            }
                        }.bind(this),
                        error:function(xhr,status,err){
                            console.error(v.sql,status,err.toString());
                        }
                    });
                    this.setState({'data':tmp});
                }.bind(this));
                this.setState({'all_data_state':false});
                this.setState({'data_state':true});

            }else{
                this.loadDefaultData();
                this.setState({'all_data_state':true});
                this.setState({'data_state':false});
            }
		},
		loadDefaultData:function(){
            var token = publicObj.get_token();

            var tmp = [];
            var url = this.props.url;

            var date = new XDate().addDays(-10).toString("yyyyMMdd");
            var sql_arr = [];

            var android_sql = "SELECT count(DISTINCT device_key) as v\
                                FROM qeeniao.app_info\
                                where platform = 'Android'\
                                and thedate >= "+date;

            var ios_sql = "SELECT count(DISTINCT device_key) as v\
                            FROM qeeniao.app_info\
                            where platform = 'iOS'\
                            and thedate >= "+date;

            sql_arr.push({'name':'android','sql':android_sql});
            sql_arr.push({'name':'ios','sql':ios_sql});

            sql_arr.forEach(function(v,k){
                $.ajax({
                    url:url,
                    data:{sql:v.sql,'access_token':token},
                    type:'post',
                    dataType:'json',
                    success:function(o){
                        tmp = this.state.all_data;
                        tmp[v.name] = o[0].v;
                        if(this.isMounted()) {
                            this.setState({'all_data': tmp});
                        }
                    }.bind(this),
                    error:function(xhr,status,err){
                        console.error(v.sql,status,err.toString());
                    }
                });
                this.setState({'all_data':tmp});
            }.bind(this));
		},
		getInitialState:function(){
			var date = new XDate().addDays(-10).toString("yyyyMMdd");
            var android_sql = "SELECT count(DISTINCT device_key) as v\
                                FROM qeeniao.app_info\
                                where platform = 'Android'\
                                and thedate >= "+date;

            var ios_sql = "SELECT count(DISTINCT device_key) as v\
                            FROM qeeniao.app_info\
                            where platform = 'iOS'\
                            and thedate >= "+date;

			return {
				data:{'ios':0,'android':0},
				date:'',
                all_data:{'ios':0,'android':0},
                data_state:false,
                all_data_state:true,
				hardware:'',
                'ajax_data':{'ios_sql':ios_sql,'android_sql':android_sql,'access_token':token}
				
			}
		},
        componentDidMount:function(){
            this.loadDefaultData();

            setInterval(function(){//60秒执行一次
                this.loadDefaultData();
            }.bind(this),330000);
        },
        componentDidUpdate:function(){

        },
		render:function(){
            var diagram;
            var singleData = [];
            var data = [];
			if(this.state.data && this.state.data.ios && this.state.data.android && this.state.data_state){
                singleData.push({'name':'ios','v':this.state.data.ios});
                singleData.push({'name':'android','v':this.state.data.android});
                diagram = React.createElement(DevicePieSingleDiagram, {className: "", id: "DevicePieSingle", id_name: "DevicePieSingle", title: "设备开机量", data: singleData})
            }else{
                diagram = React.createElement(OpenDevice, {id: "DevicePie", id_name: "DevicePie", title: "最近10天设备总开机量", ajax_data: this.state.ajax_data, url: this.props.url, interval: "300000"});
            }

			
			return (
                React.createElement("div", {className: "col-xs-6"}, 
                    React.createElement("div", {className: "row bgwhite"}, 
                        React.createElement("div", {className: "col-xs-3 bs-callout bs-callout-info"}, 
                            React.createElement("h4", null, "设备开机量: ")
                        ), 
                        React.createElement("div", {className: "col-xs-3 "}, 
                            React.createElement(SelectOptionDate, {handleDateChange: this.handleDateChange, data: this.props.date_data})
                        ), 
                        React.createElement("div", {className: "col-xs-3"}
                            
                        )
                    ), 
                    React.createElement("div", {className: "row"}, 
                    diagram
                    )
                )
			)
		}
	});

});